html,
body,
#app {
    width: 100%;
    height: 100%;
}

// 移动端特有的, 一般不会显示滚动条
::-webkit-scrollbar {
    display: none;
}

.tac {
    text-align: center;
}

.df {
    display: flex;
}

.fw {
    flex-wrap: wrap;
}

.f1 {
    flex: 1;
}

.fdc {
    flex-direction: column;
}

.fdcr {
    flex-direction: column-reverse;
}

.fdr {
    flex-direction: row;
}

.fdrr {
    flex-direction: row-reverse;
}

.jcc {
    justify-content: center;
}

.jcfs {
    justify-content: flex-start;
}

.jcfe {
    justify-content: flex-end;
}

.jcsa {
    justify-content: space-around;
}

.jcsb {
    justify-content: space-between;
}

.aic {
    align-items: center;
}

.aifs {
    align-items: flex-start;
}

.aife {
    align-items: flex-end;
}

.b-b-1px {
    border-bottom: 1px solid #CCC;
}

.b-t-1px {
    border-top: 1px solid #CCC;
}

.b-l-1px {
    border-left: 1px solid #CCC;
}

.b-r-1px {
    border-right: 1px solid #CCC;
}

.b-b {
    border: 1px solid #CCC;
}

.m-5 {
    margin: 5px;
}

.m-10 {
    margin: 10px;
}

.p-5 {
    padding: 5px;
}

.p-10 {
    padding: 10px;
}

.m-t-5 {
    margin-top: 5px;
}

.m-l-5 {
    margin-left: 5px;
}

.m-r-5 {
    margin-right: 5px;
}

.m-b-5 {
    margin-bottom: 5px;
}

.p-t-5 {
    padding-top: 5px;
}

.p-l-5 {
    padding-left: 5px;
}

.p-r-5 {
    padding-right: 5px;
}

.p-b-5 {
    padding-bottom: 5px;
}

.m-t-10 {
    margin-top: 10px;
}

.m-l-10 {
    margin-left: 10px;
}

.m-r-10 {
    margin-right: 10px;
}

.m-b-10 {
    margin-bottom: 10px;
}

.p-t-10 {
    padding-top: 10px;
}

.p-l-10 {
    padding-left: 10px;
}

.p-r-10 {
    padding-right: 10px;
}

.p-b-10 {
    padding-bottom: 10px;
}